<!DOCTYPE html>
<html>
	<head>
		<title>3D地图</title>
		<meta charset="UTF-8">
		<meta name="viewport" content="initial-scale=1.0, user-scalable=no">
		<link href="3D地图.css" rel="stylesheet" type="text/css"/>
		<link rel="stylesheet" href="standard.css" type="text/css" />
	</head>
	<body>
		<script type="text/javascript" src="https://webapi.amap.com/maps?v=1.4.13&key=c0b518cf7c41044fb95f7db7db695498"></script>
		<div id="container"></div>
		<div class="input-card" style="width: auto;">
    		<div class="input-item">
        		<button class="btn" onclick="toggleOfTraffic()">显示/隐藏实时路况</button>
        		<button class="btn" onclick="toggleOfSatellite()">显示/隐藏卫星图</button>
   			 </div>
		</div>
		<script type="text/javascript">
			//加载地图
			var map = new AMap.Map('container', {
		    	resizeEnable: true,
				rotateEnable:true,
				pitchEnable:true,
            	zooms: [4,20],//设置地图级别范围
	        	zoom:17,//级别
	        	//center: [43.765441,87.618562],//中心点坐标 P Q
	        	viewMode:'3D',//使用3D视图
                pitch:65,
                rotation:45
	    	});

	    	// layers: [//使用多个图层
            // new AMap.TileLayer.Satellite(),
            // new AMap.TileLayer.RoadNet()
            // ],
	    	//实时路况图层

	    	var trafficLayer = new AMap.TileLayer.Traffic({
	       		zIndex: 10
	    	});
            var SatelliteLayer = new AMap.TileLayer.Satellite({
            	zIndex: 10
            });

	    	//map.add(trafficLayer);//添加图层到地图
	    	trafficLayer.setMap(map);
            SatelliteLayer.setMap(map);

	    	//开关按钮，交通图的开关
	    	var isVisibleOfTraffic = true;
	    	var isVisibleOfSatellite = true;

    		function toggleOfTraffic() {
		        if (isVisibleOfTraffic) {
		            trafficLayer.hide();
		            isVisibleOfTraffic = false;
		        } else {
		            trafficLayer.show();
		            isVisibleOfTraffic = true;
		        }
    		}

            function toggleOfSatellite() {
		        if (isVisibleOfSatellite) {
		            SatelliteLayer.hide();
		            isVisibleOfSatellite = false;
		        } else {
		            SatelliteLayer.show();
		            isVisibleOfSatellite = true;
		        }
    		}


//            map.plugin('AMap.Geolocation', function () {
//                console.log("调用AMap.Geolocation");
//                geolocation = new AMap.Geolocation({
//                    enableHighAccuracy: true,//是否使用高精度定位，默认:true
//                    timeout: 10000,          //超过10秒后停止定位，默认：无穷大
//                    maximumAge: 0,           //定位结果缓存0毫秒，默认：0
//                    convert: true,           //自动偏移坐标，偏移后的坐标为高德坐标，默认：true
//                    showButton: true,        //显示定位按钮，默认：true
//                    buttonPosition: 'LB',    //定位按钮停靠位置，默认：'LB'，左下角
//                    buttonOffset: new AMap.Pixel(10, 20),//定位按钮与设置的停靠位置的偏移量，默认：Pixel(10, 20)
//                    showMarker: true,        //定位成功后在定位到的位置显示点标记，默认：true
//                    showCircle: true,        //定位成功后用圆圈表示定位精度范围，默认：true
//                    panToLocation: true,     //定位成功后将定位到的位置作为地图中心点，默认：true
//                    zoomToAccuracy:true      //定位成功后调整地图视野范围使定位位置及精度范围视野内可见，默认：false
//                });
//                map.addControl(geolocation);
//                geolocation.getCurrentPosition();
//                AMap.event.addListener(geolocation, 'complete', onComplete);//返回定位信息
//                AMap.event.addListener(geolocation, 'error', onError);      //返回定位出错信息
//            });

            var startLngLat =[43.765441,87.618562];  //得到自身的经纬度
//    		function onComplete(complete) {
//    		    console.log("定位成功");
//                //console.log(complete);
//                startLngLat =[complete.position.P,complete.position.Q];
//				console.log(startLngLat);
//            }
//			function onError(erro) {
//                console.log("定位失败"+erro);
//            }

//			map.plugin("AMap.Driving", function () {
//                console.log("调用AMap.Driving");
//				var driving = new AMap.Driving({
//					policy: AMap.DrivingPolicy.LEAST_TIME
//				});
//				var endLngLat = [43.783892,87.614503];
//                driving.search([43.765441,87.618562], [43.783892,87.614503], function (status, result) {
//                    // 未出错时，result即是对应的路线规划方案
//					console.log(startLngLat, endLngLat);
//					console.log(status,result);
//                })
//            });

			//二医院 43.783892,87.614503 新大 43.765441,87.618562
            AMap.plugin(['AMap.ToolBar','AMap.Driving'],function(){//异步同时加载多个插件
				console.log("加载插件ToolBar");
                var toolbar = new AMap.ToolBar();
                map.addControl(toolbar);

                console.log("加载插件Driving");
                var driving = new AMap.Driving({
                    // 驾车路线规划策略，AMap.DrivingPolicy.LEAST_TIME是最快捷模式
                    policy: AMap.DrivingPolicy.LEAST_TIME,
					map:map

				});
//                var startLngLat = [43.765441,87.618562];
//                var endLngLat = [43.783892,87.614503];
				var points = [
					{keyword:'新疆大学1号教学楼',city:'乌鲁木齐'},
                    {keyword:'新疆自治区人民医院门诊病房综合楼',city:'乌鲁木齐'}
				];
                driving.search(points)
            });
		</script>
	</body>
</html>